"use client"

import { View, Text, StyleSheet, TouchableOpacity, ScrollView, Platform } from "react-native"
import { SafeAreaView } from "react-native-safe-area-context"
import { LinearGradient } from "expo-linear-gradient"
import { ChevronLeft, FileTerminal } from "lucide-react-native"
import { theme } from "@/constants/theme"
import { useRouter } from "expo-router"
import Animated, { FadeInDown } from "react-native-reanimated"

export default function TermsOfServiceScreen() {
    const router = useRouter()

    return (
        <SafeAreaView style={styles.container} edges={["top"]}>
            <LinearGradient
                colors={theme.colors.neutral.backgroundGradient}
                start={{ x: 0, y: 0 }}
                end={{ x: 0, y: 1 }}
                style={styles.gradientBackground}
            >
                {/* 头部 */}
                <View style={styles.header}>
                    <TouchableOpacity style={styles.backButton} onPress={() => router.back()}>
                        <ChevronLeft size={24} color={theme.colors.neutral.black} />
                    </TouchableOpacity>
                    <Text style={styles.headerTitle}>服务条款</Text>
                    <View style={styles.headerRight} />
                </View>

                <ScrollView style={styles.scrollView} showsVerticalScrollIndicator={false}>
                    {/* 顶部图标 */}
                    {/* <Animated.View style={styles.iconContainer} entering={FadeInDown.delay(100).springify()}>
                        <View style={styles.iconBackground}>
                            <FileTerminal size={40} color={theme.colors.secondary.green.default} />
                        </View>
                    </Animated.View> */}

                    {/* 内容卡片 */}
                    <Animated.View style={styles.contentCard} entering={FadeInDown.delay(200).springify()}>
                        <Text style={styles.lastUpdated}>最后更新日期: 2025年3月15日</Text>

                        <Text style={styles.sectionTitle}>1. 接受条款</Text>
                        <Text style={styles.paragraph}>
                            欢迎使用育儿英文教育应用（"本应用"）。通过下载、安装或使用本应用，您同意受本服务条款（"条款"）的约束。如果您不同意这些条款，请勿使用本应用。
                        </Text>

                        <Text style={styles.sectionTitle}>2. 服务描述</Text>
                        <Text style={styles.paragraph}>
                            本应用提供英语学习工具和资源，旨在帮助儿童和家长学习英语。我们可能会不时更新、修改或暂时停用部分或全部服务，恕不另行通知。
                        </Text>

                        <Text style={styles.sectionTitle}>3. 用户账户</Text>
                        <Text style={styles.paragraph}>
                            某些功能可能需要您创建账户。您负责维护您账户的保密性，并对发生在您账户下的所有活动负责。您同意：
                        </Text>
                        <Text style={styles.bulletPoint}>• 提供准确、完整的注册信息。</Text>
                        <Text style={styles.bulletPoint}>• 保护您的账户安全，不与他人共享。</Text>
                        <Text style={styles.bulletPoint}>• 立即通知我们任何未经授权使用您账户的情况。</Text>

                        <Text style={styles.sectionTitle}>4. 会员订阅</Text>
                        <Text style={styles.paragraph}>本应用提供免费和付费会员服务。关于会员订阅：</Text>
                        <Text style={styles.bulletPoint}>• 付款将通过您的应用商店账户（如App Store或Google Play）处理。</Text>
                        <Text style={styles.bulletPoint}>• 订阅会自动续订，除非您在当前订阅期结束前至少24小时取消。</Text>
                        <Text style={styles.bulletPoint}>• 取消订阅必须通过您的应用商店账户设置进行。</Text>
                        <Text style={styles.bulletPoint}>• 订阅费用不可退还，除非适用法律另有规定。</Text>

                        <Text style={styles.sectionTitle}>5. 用户行为</Text>
                        <Text style={styles.paragraph}>使用本应用时，您同意不会：</Text>
                        <Text style={styles.bulletPoint}>• 违反任何适用法律或法规。</Text>
                        <Text style={styles.bulletPoint}>• 侵犯他人的知识产权或其他权利。</Text>
                        <Text style={styles.bulletPoint}>• 上传或传播有害、欺诈或侵权内容。</Text>
                        <Text style={styles.bulletPoint}>• 干扰或破坏应用的正常运行。</Text>
                        <Text style={styles.bulletPoint}>• 尝试未经授权访问应用的任何部分。</Text>

                        <Text style={styles.sectionTitle}>6. 知识产权</Text>
                        <Text style={styles.paragraph}>
                            本应用及其内容（包括但不限于文本、图形、徽标、图标、图像、音频剪辑、数字下载和软件）是我们或我们的许可方的财产，受版权、商标和其他知识产权法保护。未经我们明确书面许可，您不得复制、修改、分发、展示、表演或创建本应用内容的衍生作品。
                        </Text>

                        <Text style={styles.sectionTitle}>7. 免责声明</Text>
                        <Text style={styles.paragraph}>
                            本应用按"现状"和"可用"基础提供，不提供任何明示或暗示的保证。在法律允许的最大范围内，我们不对任何直接、间接、附带、特殊、后果性或惩罚性损害负责，包括但不限于利润损失、商誉、使用或数据损失。
                        </Text>

                        <Text style={styles.sectionTitle}>8. 条款变更</Text>
                        <Text style={styles.paragraph}>
                            我们保留随时修改这些条款的权利。修改后的条款将在应用内发布时生效。继续使用本应用将视为您接受修改后的条款。
                        </Text>

                        <Text style={styles.sectionTitle}>9. 终止</Text>
                        <Text style={styles.paragraph}>
                            我们可能会因任何原因，包括但不限于违反这些条款，随时终止或暂停您对本应用的访问，恕不另行通知。
                        </Text>

                        <Text style={styles.sectionTitle}>10. 适用法律</Text>
                        <Text style={styles.paragraph}>这些条款受中华人民共和国法律管辖，不考虑法律冲突原则。</Text>

                        <Text style={styles.sectionTitle}>11. 联系我们</Text>
                        <Text style={styles.paragraph}>如果您对这些条款有任何疑问，请联系我们：</Text>
                        <Text style={styles.contactInfo}>电子邮件：terms@kidsenglish.com</Text>
                        <Text style={styles.contactInfo}>电话：400-123-4567</Text>
                    </Animated.View>
                </ScrollView>
            </LinearGradient>
        </SafeAreaView>
    )
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: theme.colors.neutral.background,
    },
    gradientBackground: {
        flex: 1,
    },
    header: {
        flexDirection: "row",
        alignItems: "center",
        justifyContent: "space-between",
        paddingHorizontal: theme.spacing.lg,
        paddingVertical: theme.spacing.md,
    },
    backButton: {
        width: 40,
        height: 40,
        borderRadius: 20,
        alignItems: "center",
        justifyContent: "center",
        backgroundColor: "rgba(255, 255, 255, 0.5)",
    },
    headerTitle: {
        fontSize: theme.fontSize.lg,
        fontWeight: theme.fontWeight.bold,
        color: theme.colors.neutral.black,
    },
    headerRight: {
        width: 40,
    },
    scrollView: {
        flex: 1,
    },
    iconContainer: {
        alignItems: "center",
        marginVertical: theme.spacing.lg,
    },
    iconBackground: {
        width: 80,
        height: 80,
        borderRadius: 40,
        backgroundColor: theme.colors.secondary.green.light,
        alignItems: "center",
        justifyContent: "center",
        ...Platform.select({
            ios: {
                shadowColor: "rgba(52, 199, 89, 0.3)",
                shadowOffset: { width: 0, height: 4 },
                shadowOpacity: 0.3,
                shadowRadius: 8,
            },
            android: {
                elevation: 4,
            },
        }),
    },
    contentCard: {
        marginHorizontal: theme.spacing.lg,
        marginBottom: theme.spacing.xxxl,
        backgroundColor: theme.colors.neutral.white,
        borderRadius: theme.borderRadius.large,
        padding: theme.spacing.xl,
        ...Platform.select({
            ios: {
                shadowColor: "rgba(0, 0, 0, 0.1)",
                shadowOffset: { width: 0, height: 2 },
                shadowOpacity: 0.2,
                shadowRadius: 4,
            },
            android: {
                elevation: 3,
            },
        }),
    },
    lastUpdated: {
        fontSize: theme.fontSize.sm,
        color: theme.colors.neutral.gray,
        marginBottom: theme.spacing.lg,
        textAlign: "center",
        fontStyle: "italic",
    },
    sectionTitle: {
        fontSize: theme.fontSize.md,
        fontWeight: theme.fontWeight.bold,
        color: theme.colors.secondary.green.default,
        marginTop: theme.spacing.lg,
        marginBottom: theme.spacing.sm,
    },
    paragraph: {
        fontSize: theme.fontSize.sm,
        color: theme.colors.neutral.darkGray,
        lineHeight: 20,
        marginBottom: theme.spacing.md,
    },
    bulletPoint: {
        fontSize: theme.fontSize.sm,
        color: theme.colors.neutral.darkGray,
        lineHeight: 20,
        marginLeft: theme.spacing.md,
        marginBottom: theme.spacing.xs,
    },
    contactInfo: {
        fontSize: theme.fontSize.sm,
        color: theme.colors.secondary.green.default,
        marginLeft: theme.spacing.md,
        marginBottom: theme.spacing.xs,
        fontWeight: theme.fontWeight.medium,
    },
})

